<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="员工编号">
              <j-input placeholder="请输入员工编号" v-model="queryParam.employeeCode"></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="员工姓名">
              <j-input placeholder="请输入员工姓名" v-model="queryParam.employeeName"></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <a @click="handleToggleSearch" style="margin-left: 8px">
                {{ toggleSearchStatus ? '收起' : '展开' }}
                <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
              </a>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->
    <div class="table-operator">
      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
      <a-button type="primary" icon="download" @click="handleExportXls('人员信息表')">导出</a-button>
      <!-- <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
        <a-button type="primary" icon="import">导入</a-button>
      </a-upload> -->
      <!-- 高级查询区域 -->
      <j-super-query
        :fieldList="superFieldList"
        ref="superQueryModal"
        @handleSuperQuery="handleSuperQuery"
      ></j-super-query>
      <a-dropdown v-if="selectedRowKeys.length > 0">
        <a-menu slot="overlay">
          <a-menu-item key="1" @click="batchDel"><a-icon type="delete" />删除</a-menu-item>
        </a-menu>
        <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>
      </a-dropdown>
    </div>
    <div class="ant-alert ant-alert-info" style="margin-bottom: 16px">
      <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择
      <a style="font-weight: 600">{{ selectedRowKeys.length }}</a
      >项
      <a style="margin-left: 24px" @click="onClearSelected">清空</a>
    </div>
    <a-tabs v-model="activeKey">
      <a-tab-pane key="on" tab="在职员工">
        <!-- table区域-begin -->
        <div>
          <a-table
            ref="table"
            size="middle"
            :scroll="{ x: true }"
            bordered
            rowKey="id"
            :columns="columns"
            :dataSource="dataSource"
            :pagination="ipagination"
            :loading="loading"
            :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
            class="j-table-force-nowrap1"
            @change="handleTableChange"
          >
            <template slot="htmlSlot" slot-scope="text">
              <div v-html="text"></div>
            </template>
            <template slot="imgSlot" slot-scope="text, record">
              <span v-if="!text" style="font-size: 12px; font-style: italic">无图片</span>
              <img
                v-else
                :src="getImgView(text)"
                :preview="record.id"
                height="25px"
                alt=""
                style="max-width: 80px; font-size: 12px; font-style: italic"
              />
            </template>
            <template slot="fileSlot" slot-scope="text">
              <span v-if="!text" style="font-size: 12px; font-style: italic">无文件</span>
              <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="downloadFile(text)">
                下载
              </a-button>
            </template>

            <span slot="action" slot-scope="text, record">
              <a @click="handleEdit(record)">编辑</a>
              <a-divider type="vertical" />
              <a @click="handleLeave(record)">离职</a>
              <a-divider type="vertical" />
              <a-dropdown>
                <a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
                <a-menu slot="overlay">
                  <a-menu-item>
                    <a @click="handleDetail(record)">详情</a>
                  </a-menu-item>
                  <a-menu-item>
                    <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                      <a>删除</a>
                    </a-popconfirm>
                  </a-menu-item>
                </a-menu>
              </a-dropdown>
            </span>
          </a-table>
        </div>
      </a-tab-pane>
      <a-tab-pane key="off" tab="离职员工">
        <!-- table区域-begin -->
        <div>
          <!-- <div class="ant-alert ant-alert-info" style="margin-bottom: 16px">
            <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择
            <a style="font-weight: 600">{{ leaveTable.selectedRowKeys.length }}</a
            >项
            <a style="margin-left: 24px" @click="onClearSelectedLeave">清空</a>
          </div> -->
          <a-table
            ref="leaveTable"
            size="middle"
            :scroll="{ x: true }"
            bordered
            rowKey="id"
            :columns="leaveTable.columns"
            :dataSource="leaveTable.dataSource"
            :pagination="leaveTable.ipagination"
            :loading="leaveTable.loading"
            :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
            class="j-table-force-nowrap1"
          >
            <template slot="htmlSlot" slot-scope="text">
              <div v-html="text"></div>
            </template>
            <template slot="imgSlot" slot-scope="text, record">
              <span v-if="!text" style="font-size: 12px; font-style: italic">无图片</span>
              <img
                v-else
                :src="getImgView(text)"
                :preview="record.id"
                height="25px"
                alt=""
                style="max-width: 80px; font-size: 12px; font-style: italic"
              />
            </template>
            <template slot="fileSlot" slot-scope="text">
              <span v-if="!text" style="font-size: 12px; font-style: italic">无文件</span>
              <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="downloadFile(text)">
                下载
              </a-button>
            </template>

            <span slot="leaveaction" slot-scope="text, record">
              <a @click="handleEdit(record)">编辑</a>
              <a-divider type="vertical" />
              <a @click="handleBack(record)">复职</a>
              <a-divider type="vertical" />
              <a-dropdown>
                <a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
                <a-menu slot="overlay">
                  <a-menu-item>
                    <a @click="handleDetail(record)">详情</a>
                  </a-menu-item>
                  <a-menu-item>
                    <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                      <a>删除</a>
                    </a-popconfirm>
                  </a-menu-item>
                </a-menu>
              </a-dropdown>
            </span>
          </a-table>
        </div>
      </a-tab-pane>
    </a-tabs>

    <tsl-hr-employee-info-modal ref="modalForm" @ok="modalFormOk"></tsl-hr-employee-info-modal>
    <tsl-employee-leave-modal ref="leaveModalForm" @ok="leaveModalFormOk" />
  </a-card>
</template>

<script>
import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import TslHrEmployeeInfoModal from './modules/TslHrEmployeeInfoModal'
import TslEmployeeLeaveModal from './modules/TslEmployeeLeaveModal'
import { filterObj } from '@/utils/util'
import { deleteAction, getAction, httpAction } from '@api/manage'

export default {
  name: 'TslHrEmployeeInfoList',
  mixins: [JeecgListMixin, mixinDevice],
  components: {
    TslHrEmployeeInfoModal,
    TslEmployeeLeaveModal,
  },
  data() {
    return {
      description: '人员信息表管理页面',
      activeKey: 'on',
      ipagination: {
          current: 1,
          pageSize: 30,
          pageSizeOptions: ['20', '50', '100'],
          showTotal: (total, range) => {
            return range[0] + '-' + range[1] + ' 共' + total + '条'
          },
          showQuickJumper: true,
          showSizeChanger: true,
          total: 0,
        },
      leaveTable: {
        selectedRowKeys: [],
        selectionRows: [],
        loading: false,
        // 表头
        ipagination: {
          current: 1,
          pageSize: 30,
          pageSizeOptions: ['10', '30', '100'],
          showTotal: (total, range) => {
            return range[0] + '-' + range[1] + ' 共' + total + '条'
          },
          showQuickJumper: true,
          showSizeChanger: true,
          total: 0,
        },
        columns: [
          {
            title: '#',
            dataIndex: '',
            key: 'rowIndex',
            width: 60,
            align: 'center',
            fixed: 'left',
            customRender: function (t, r, index) {
              return parseInt(index) + 1
            },
          },
          {
            title: '员工编号',
            align: 'center',
            sorter: true,
            fixed: 'left',
            dataIndex: 'employeeCode',
          },
          {
            title: '员工姓名',
            align: 'center',
            sorter: true,
            fixed: 'left',
            dataIndex: 'employeeName',
          },
          {
            title: '部门',
            align: 'center',
            sorter: true,
            fixed: 'left',
            dataIndex: 'departCode_dictText',
          },
          {
            title: '籍贯',
            align: 'center',
            dataIndex: 'birthplace',
          },
          {
            title: '性别',
            align: 'center',
            sorter: true,
            dataIndex: 'sex_dictText',
          },
          {
            title: '民族',
            align: 'center',
            dataIndex: 'nation',
          },
          {
            title: '年龄',
            align: 'center',
            dataIndex: 'age',
          },
          {
            title: '家庭住址',
            align: 'center',
            dataIndex: 'address',
          },
          {
            title: '户口所在地',
            align: 'center',
            dataIndex: 'registerLocation',
          },
          {
            title: '手机号',
            align: 'center',
            dataIndex: 'telephone',
          },
          {
            title: '合同类型',
            align: 'center',
            dataIndex: 'contractType_dictText',
          },
          {
            title: '离职日期',
            align: 'center',
            dataIndex: 'leaveDate',
            ifShow: (_column) => {
              return this.activeKey == 'off'
            },
            customRender: function (text) {
              return !text ? '' : text.length > 10 ? text.substr(0, 10) : text
            },
          },
          {
            title: '离职原因',
            align: 'center',
            dataIndex: 'leaveReason',
          },
          {
            title: '离职部门',
            align: 'center',
            dataIndex: 'leaveDepart',
          },

          {
            title: '操作',
            dataIndex: 'leaveaction',
            align: 'center',
            fixed: 'right',
            width: 147,
            scopedSlots: { customRender: 'leaveaction' },
          },
        ],
      },
      // 表头
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          fixed: 'left',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        {
          title: '员工编号',
          align: 'center',
          sorter: true,
          fixed: 'left',
          dataIndex: 'employeeCode',
        },
        {
          title: '员工姓名',
          align: 'center',
          sorter: true,
          fixed: 'left',
          dataIndex: 'employeeName',
        },
        {
          title: '所属部门',
          align: 'center',
          sorter: true,
          fixed: 'left',
          dataIndex: 'departCode_dictText',
        },
        {
          title: '岗位',
          align: 'center',
          dataIndex: 'post_dictText',
        },
        {
          title: '籍贯',
          align: 'center',
          dataIndex: 'birthplace',
        },
        {
          title: '婚姻状况',
          align: 'center',
          dataIndex: 'marriageStatus_dictText',
        },
        {
          title: '曾用名',
          align: 'center',
          dataIndex: 'previousName',
        },
        {
          title: '性别',
          align: 'center',
          sorter: true,
          dataIndex: 'sex_dictText',
        },
        {
          title: '民族',
          align: 'center',
          dataIndex: 'nation',
        },
        {
          title: '年龄',
          align: 'center',
          dataIndex: 'age',
        },
        {
          title: '出生日期',
          align: 'center',
          dataIndex: 'birthDate',
          customRender: function (text) {
            return !text ? '' : text.length > 10 ? text.substr(0, 10) : text
          },
        },

        {
          title: '身份证号',
          align: 'center',
          dataIndex: 'idCard',
        },
        {
          title: '家庭住址',
          align: 'center',
          dataIndex: 'address',
        },
        {
          title: '户口所在地',
          align: 'center',
          dataIndex: 'registerLocation',
        },
        {
          title: '手机号',
          align: 'center',
          dataIndex: 'telephone',
        },
        {
          title: '电子邮件',
          align: 'center',
          dataIndex: 'email',
        },
        {
          title: '学历',
          align: 'center',
          dataIndex: 'educationBackground_dictText',
        },
        {
          title: '毕业院校',
          align: 'center',
          dataIndex: 'graduatedFrom',
        },
        {
          title: '专业',
          align: 'center',
          dataIndex: 'major',
        },
        {
          title: '职务',
          align: 'center',
          dataIndex: 'duties',
        },

        {
          title: '入职时间',
          align: 'center',
          dataIndex: 'entryDate',
          customRender: function (text) {
            return !text ? '' : text.length > 10 ? text.substr(0, 10) : text
          },
        },
        {
          title: '合同类型',
          align: 'center',
          dataIndex: 'contractType_dictText',
        },
        {
          title: '合同开始日期',
          align: 'center',
          dataIndex: 'contractStartDate',
          customRender: function (text) {
            return !text ? '' : text.length > 10 ? text.substr(0, 10) : text
          },
        },
        {
          title: '合同终止日期',
          align: 'center',
          dataIndex: 'contractEndDate',
          customRender: function (text) {
            return !text ? '' : text.length > 10 ? text.substr(0, 10) : text
          },
        },
        {
          title: '证书取得',
          align: 'center',
          dataIndex: 'certificates',
        },
        {
          title: '工作经历',
          align: 'center',
          dataIndex: 'workExperience',
        },
        {
          title: '学习经历',
          align: 'center',
          dataIndex: 'educationExperience',
        },
        {
          title: '备注',
          align: 'center',
          dataIndex: 'remark',
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          fixed: 'right',
          width: 147,
          scopedSlots: { customRender: 'action' },
        },
      ],
      url: {
        list: '/hr/tslHrEmployeeInfo/list',
        edit: '/hr/tslHrEmployeeInfo/edit',
        delete: '/hr/tslHrEmployeeInfo/delete',
        deleteBatch: '/hr/tslHrEmployeeInfo/deleteBatch',
        exportXlsUrl: '/hr/tslHrEmployeeInfo/exportXls',
        importExcelUrl: 'hr/tslHrEmployeeInfo/importExcel',
      },
      dictOptions: {},
      superFieldList: [],
    }
  },
  created() {
    this.loadData()
    this.loadLeaveData()
    this.getSuperFieldList()
  },
  computed: {
    importExcelUrl: function () {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
    },
  },
  methods: {
    onSelectChange(selectedRowKeys, selectionRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectionRows = selectionRows
      // this.selectedRowKeys = [...this.selectedRowKeys, selectedRowKeys]
      // this.selectionRows = [...this.selectionRows, selectionRows]
      console.log(this.selectedRowKeys, this.selectionRows, 'selection')
    },
    onClearSelectedLeave() {
      this.leaveTable.selectedRowKeys = []
      this.leaveTable.selectionRows = []
    },
    leaveModalFormOk() {
      this.loadLeaveData()
      this.loadData()
    },
    modalFormOk() {
      this.loadLeaveData()
      this.loadData()
    },
    handleLeave(record) {
      console.log('办理离职！', record)
      this.$refs.leaveModalForm.edit(record)
    },
    handleBack(record) {
      record.status = '1'
      if (record && record.id) {
        this.confirmLoading = true
        let httpurl = ''
        let method = ''

        httpurl += this.url.edit
        method = 'put'
        httpAction(httpurl, record, method)
          .then((res) => {
            if (res.success) {
              this.$message.success(res.message)
              this.$emit('ok')
            } else {
              this.$message.warning(res.message)
            }
          })
          .finally(() => {
            this.confirmLoading = false
            this.loadLeaveData()
            this.loadData()
          })
      }
    },
    getLeaveQueryParams() {
      //获取查询条件
      var param = {}
      var param = Object.assign({}, {}, {}, {})
      param.pageNo = this.leaveTable.ipagination.current
      param.pageSize = this.leaveTable.ipagination.pageSize
      param.employeeCode = this.queryParam.employeeCode
      param.employeeName = this.queryParam.employeeName
      param.status = '0'
      return filterObj(param)
    },
    getLeaveTableQueryField() {
      //TODO 字段权限控制
      var str = 'id,'
      this.LeaveTable.columns.forEach(function (value) {
        str += ',' + value.dataIndex
      })
      return str
    },
    loadData() {
      var params = this.getQueryParams()
      console.log(params, 'loadDATA')
      //选择在职人员
      params.status = '1';
      this.loading = true;
      getAction(this.url.list, params)
        .then((res) => {
          if (res.success) {
            //update-begin---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
            this.dataSource = res.result.records || res.result
            if (res.result.total) {
              this.ipagination.total = res.result.total
            } else {
              this.ipagination.total = 0
            }
            //update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
          } else {
            this.$message.warning(res.message)
          }
        })
        .finally(() => {
          this.loading = false
        })
    },
    loadLeaveData() {
      var params = this.getLeaveQueryParams() //查询条件
      this.leaveTable.loading = true
      getAction(this.url.list, params)
        .then((res) => {
          if (res.success) {
            //update-begin---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
            this.leaveTable.dataSource = res.result.records || res.result
            if (res.result.total) {
              this.leaveTable.ipagination.total = res.result.total
            } else {
              this.leaveTable.ipagination.total = 0
            }
            //update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
          } else {
            this.$message.warning(res.message)
          }
        })
        .finally(() => {
          this.leaveTable.loading = false
        })
    },
    initDictConfig() {},
    getSuperFieldList() {
      let fieldList = []
      fieldList.push({ type: 'sel_depart', value: 'departCode', text: '所属部门' })
      fieldList.push({ type: 'string', value: 'employeeCode', text: '员工编号', dictCode: '' })
      fieldList.push({ type: 'string', value: 'employeeName', text: '员工姓名', dictCode: '' })
      fieldList.push({ type: 'string', value: 'birthplace', text: '籍贯', dictCode: '' })
      fieldList.push({ type: 'int', value: 'marriageStatus', text: '婚姻状况', dictCode: 'marriage_status' })
      fieldList.push({ type: 'string', value: 'previousName', text: '曾用名', dictCode: '' })
      fieldList.push({ type: 'int', value: 'sex', text: '性别', dictCode: 'sex' })
      fieldList.push({ type: 'string', value: 'nation', text: '民族', dictCode: '' })
      fieldList.push({ type: 'int', value: 'age', text: '年龄', dictCode: '' })
      fieldList.push({ type: 'date', value: 'birthDate', text: '出生日期' })
      fieldList.push({ type: 'string', value: 'idCard', text: '身份证号', dictCode: '' })
      fieldList.push({ type: 'string', value: 'address', text: '家庭住址', dictCode: '' })
      fieldList.push({ type: 'string', value: 'registerLocation', text: '户口所在地', dictCode: '' })
      fieldList.push({ type: 'string', value: 'telephone', text: '手机号', dictCode: '' })
      fieldList.push({ type: 'string', value: 'qqCode', text: 'QQ', dictCode: '' })
      fieldList.push({ type: 'string', value: 'email', text: '电子邮件', dictCode: '' })
      fieldList.push({ type: 'string', value: 'officeCall', text: '办公电话', dictCode: '' })
      fieldList.push({ type: 'int', value: 'educationBackground', text: '学历', dictCode: 'education_background' })
      fieldList.push({ type: 'string', value: 'graduatedFrom', text: '毕业院校', dictCode: '' })
      fieldList.push({ type: 'string', value: 'major', text: '专业', dictCode: '' })
      fieldList.push({ type: 'string', value: 'duties', text: '职务', dictCode: '' })
      fieldList.push({ type: 'string', value: 'post', text: '岗位', dictCode: '' })
      fieldList.push({ type: 'date', value: 'firstJobDate', text: '参加工作时间' })
      fieldList.push({ type: 'date', value: 'entryDate', text: '入职时间' })
      fieldList.push({ type: 'int', value: 'contractType', text: '合同类型', dictCode: 'employee_contract_type' })
      fieldList.push({ type: 'date', value: 'contractStartDate', text: '合同开始日期' })
      fieldList.push({ type: 'date', value: 'contractEndDate', text: '合同终止日期' })
      fieldList.push({ type: 'string', value: 'socialInsurance', text: '保险说明', dictCode: '' })
      fieldList.push({ type: 'BigDecimal', value: 'fixedSalary', text: '固定工资', dictCode: '' })
      fieldList.push({ type: 'BigDecimal', value: 'performanceSalary', text: '绩效工资', dictCode: '' })
      fieldList.push({ type: 'string', value: 'attenceCode', text: '考勤编号', dictCode: '' })
      fieldList.push({ type: 'string', value: 'bankCardCode', text: '银行卡号', dictCode: '' })
      fieldList.push({ type: 'date', value: 'insuranceDate', text: '公司参保时间' })
      fieldList.push({ type: 'int', value: 'insuranceType', text: '参保类型', dictCode: 'insurance_type' })
      fieldList.push({ type: 'string', value: 'fileCode', text: '档案号', dictCode: '' })
      fieldList.push({ type: 'string', value: 'photo', text: '照片', dictCode: '' })
      fieldList.push({ type: 'int', value: 'accident', text: '意外', dictCode: 'accident_pay' })
      fieldList.push({ type: 'int', value: 'riskPay', text: '风险金', dictCode: 'risk_pay' })
      fieldList.push({ type: 'BigDecimal', value: 'seniorityWage', text: '工龄工资', dictCode: '' })
      fieldList.push({ type: 'string', value: 'attachment', text: '附件列表', dictCode: '' })
      fieldList.push({ type: 'string', value: 'certificates', text: '证书取得', dictCode: '' })
      fieldList.push({ type: 'string', value: 'workExperience', text: '工作经历', dictCode: '' })
      fieldList.push({ type: 'string', value: 'educationExperience', text: '学习经历', dictCode: '' })
      fieldList.push({ type: 'string', value: 'remark', text: '备注', dictCode: '' })
      fieldList.push({ type: 'date', value: 'leaveDate', text: '离职日期' })
      fieldList.push({ type: 'string', value: 'leaveReason', text: '离职原因', dictCode: '' })
      fieldList.push({ type: 'string', value: 'leaveDepart', text: '离职部门', dictCode: '' })
      this.superFieldList = fieldList
    },
  },
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
